<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:include page="/WEB-INF/jsp/head.jsp"></jsp:include>
<jsp:include page="/WEB-INF/jsp/navigation.jsp"></jsp:include>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>  
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=ko"> </script>  
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places&sensor=true"></script>

<script type="text/javascript">  
    $(document).ready(function() {  
        var latlng = new google.maps.LatLng(37.5640, 126.9751);  
        var myOptions = {  
              zoom : 12,  
              center : latlng,  
              mapTypeId : google.maps.MapTypeId.ROADMAP  
        } 

        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);  
        var marker = new google.maps.Marker({  
            position : map.getCenter(),   
            map : map,
            title: 'Click to zoom'
        });  
          
        var geocoder = new google.maps.Geocoder();  
          
        google.maps.event.addListener(map, 'click', function(event) {  
            placeMarker(event.latLng);
/*             var location = event.latLng;  geocoder.geocode({  
                'latLng' : location  
            },  
            function(results, status){  
                if( status == google.maps.GeocoderStatus.OK ) {  
                    $('#address').html(results[0].formatted_address);  
                    $('#lat').html(results[0].geometry.location.lat());  
                    $('#lng').html(results[0].geometry.location.lng());  
                }  
                else {  
                    alert("Geocoder failed due to: " + status);  
                }  
            });  
            if( !marker ) {  
                marker = new google.maps.Marker({  
                    position : location,   
                    map : map  
                });  
            }  
            else {  
                marker.setMap(null);  
                marker = new google.maps.Marker({  
                    position : location,   
                    map : map  
                });  
            }  
            map.setCenter(location);  
        });   */
    });  
    });
    function placeMarker(location) {
        var marker = new google.maps.Marker({
            position: location,
            map: map
        });     
        
        map.setCenter(location);
    }
</script>  
<div class="parsingPage" style="float: left; width: 991px;
                             height: 1117px; margin-left: 5px;-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.4);
                             box-shadow: 0 1px 2px rgba(0,0,0,0.4);background-color: #FCF8F8;
                             border-radius: 12px;">

    <div style="float: left; width: 99%; height: 99%; margin: 6px;">
        <div id="map-contents"> </div>
        <div id="map_canvas" style="width: 100%; height: 100%;"></div>
    </div>

</div>

    
</div> <!--Content Div END  -->
<jsp:include page="/WEB-INF/jsp/footer.jsp"></jsp:include>